<!--
 * @Descripttion: 
 * @version: 
 * @Author: wtzhang
 * @Date: 2021-08-27 10:40:43
 * @LastEditors: wtzhang
 * @LastEditTime: 2021-08-30 10:19:49
-->
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <div id="test">
    <p>111</p>
    <p>222</p>
    <p>333</p>
  </div>
  <script>
    // 扩展运算符
    let arr = [1, ...[2, 3], 4]
    console.log(...arr);
    console.log(document.querySelectorAll('p'));
    console.log(...document.querySelectorAll('p'));
    let x = 2;
    const arr1 = [
      ...(x > 0 ? ['a'] : []),
      'b',
    ];
    console.log(arr1);
    function f(v, w, x, y, z) {
      console.log(v, w, x, y, z);
    }
    const args = [0, 1];
    let fn = f(-1, ...args, 2, ...[3]);
    console.log(fn);

    function fn1(x, y, z) {
      console.log(x, y, z);
    }
    let args1 = [0, 1, 2]
    fn1.apply(null, args1)

    // ES5 的写法
    console.log(Math.max.apply(null, [14, 3, 77])); // 77
    // ES6 的写法
    console.log(Math.max(...[14, 3, 77])); // 77

    let map = new Map([
      [1, 'one'],
      [2, 'two'],
      [3, 'three'],
    ]);

    let arr2 = [...map.keys()]; // [1, 2, 3]
    // let arr2 = [...map.values()]; // ["one", "two", "three"]
    console.log(arr2);

    let obj = {
      '1': 'hello',
      '2': 'say'
    }
    function getValue(key) {
      return  key in obj ? obj[key] : null
    }
    let res2 = getValue('1')
    console.log(res2);

    let objres1 = Object.values(obj)
    // let objres = Array.from(obj)
    console.log(objres1);
  </script>
</body>

</html>